<template>
  <div class="select-file">
    <el-dialog
      title="选择文件"
      :visible.sync="dialogVisible"
      :close-on-click-modal="false"
      :lock-scroll="false"
      :append-to-body="true"
      width="1240px"
    >
      <div style="min-height: 60vh">
        <Layout />
      </div>
      <!-- <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm()">提交</el-button>
        <el-button @click="dialogVisible = false">取 消</el-button>
      </span> -->
    </el-dialog>
  </div>
</template>
<script>
export default {
  components: {
    Layout: () => import('./Layout.vue'),
  },
  data() {
    return {
      dialogVisible: false,
      props: {
        showType: '',
      },
    }
  },
  mounted() {
    this.$bus.$on('selectFile', (v) => {
      this.$bus.$emit('clearCheckList')
      if (v) {
        Object.assign(this.props, v)
      }
      this.dialogVisible = true
    })
    this.$bus.$on('closeSelectFileDialog', (v) => {
      if (v && v.length) {
        let { showType } = this.props
        if (showType && v[0].showType != showType) {
          this.showTypeTips(showType)
          return
        }
        this.$emit('emit', v)
      }
      this.$store.dispatch('selectFile', [])
      this.dialogVisible = false
    })
  },
  beforeDestroy() {
    this.$bus.$off('selectFile')
    this.$bus.$off('closeSelectFileDialog')
  },
  methods: {
    showTypeTips(type) {
      let txt = ''
      switch (type) {
        case 1:
          txt = '图片'
          break
        case 2:
          txt = '音频'
          break
        case 3:
          txt = '视频'
          break
        case 4:
          txt = '文档'
          break
        case 5:
          txt = '压缩'
          break
        case 6:
          txt = '其他'
          break
      }
      this.warnMsg('请选择' + txt + '文件')
    },
  },
}
</script>